<section>
  <div data-extend-template="layouts/partials/table.html">
    <div data-block="search">
      <input type="text"
             class="form-control"
             placeholder="{{ 'Filter' | translate }}"
             ng-model="hostCollectionFilter"/>
    </div>

    <div data-block="list-actions">
      <button ng-if="isState('activation-key.host-collections.list')"
              type="button"
              class="btn btn-default"
              ng-hide="denied('edit_activation_keys', activationKey)"
              ng-disabled="table.numSelected == 0 || table.working"
              ng-click="removeHostCollections()">
        {{ 'Remove Selected' | translate }}
      </button>
      <button ng-if="isState('activation-key.host-collections.add')"
              type="button"
              class="btn btn-default"
              ng-hide="denied('edit_activation_keys', activationKey)"
              ng-disabled="table.numSelected == 0 || table.working"
              ng-click="addHostCollections()">
        {{ 'Add Selected' | translate }}
      </button>
    </div>

    <div data-block="table">
      <table ng-class="{'table-mask': table.working}" class="table table-bordered table-striped">
        <thead>
          <tr bst-table-head row-select="hostCollection">
            <th bst-table-column="name" translate>Name</th>
            <th bst-table-column="description" translate>Description</th>
            <th bst-table-column="capacity" translate>Capacity</th>
          </tr>
        </thead>

        <tbody>
          <tr bst-table-row ng-repeat="hostCollection in table.rows | filter:hostCollectionFilter" row-select="hostCollection">
            <td bst-table-cell>
              <a ui-sref="host-collection.info({hostCollectionId: hostCollection.id})">
                {{ hostCollection.name }}
              </a>
            </td>
            <td bst-table-cell>{{ hostCollection.description }}</td>
            <td bst-table-cell>{{ hostCollection.total_hosts }} / {{ hostCollection.max_hosts | unlimitedFilter:hostCollection.unlimited_hosts }}</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</section>
